<template>
  <div class="authentication" v-show="isshow">
    <div class="main">
      <div>
        <p>您当前的身份信息已失效</p>
        <p>是否需要重新登录？</p>
      </div>
      <div>
        <span @click="cancel">取消</span>
        <span @click="comfirm">确定</span>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      isshow: true
    };
  },
  methods: {
    cancel(){

      this.isshow=false
    },
    comfirm(){
      this.$router.push('/login')
    }
  },
};
</script>
<style lang="scss" scoped>
.authentication {
  width: 100%;
  height: 36.8rem;
  position: absolute;
  left: 0;
  top: 0;
  background-color:rgba(0, 0, 0, 0.5);
  z-index: 300;
  .main {
    width: 14.375rem;
    height: 6.375rem;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -7.1875rem;
    margin-top: -3.1875rem;
    border-radius: 0.625rem;
    background: white;
    z-index: 301;
    div:nth-of-type(1) {
      padding: 0.625rem;
      border-bottom: 1px solid #666;
      font-size: .875rem;
    }
    div:nth-of-type(2) {
      //  height: 100%;
      height: 2.8rem;
      display: flex;
      justify-content: space-between;
      span {
        width: 50%;
        line-height: 2.43rem;
        // height: 100%;
      }
      span:nth-of-type(1) {
        border-right: 1px solid #666;
        color: #8909ac;
      }
      span:nth-of-type(2) {
        color: #4a90e2;
      }
    }
  }
}
</style>